<template>
  <div class="tiwen">
    <div class="tiwen-content">
      <div class="tiwen-title">隔离监护管理/重点监护管理</div>
      <h5 class="tiwen-h2">查询与添加</h5>
      <div>
        <div class="tiwen-input">
        <p>姓名：</p>
        <el-input placeholder="请输入内容" v-model="name" clearable></el-input>
      </div>
      <div class="tiwen-input">
        <p>学号：</p>
        <el-input placeholder="请输入内容" v-model="snoTno" clearable></el-input>
      </div>
      <div class="tiwen-input">
        <p>身份证号：</p>
        <el-input placeholder="请输入内容" v-model="idCard" clearable></el-input>
      </div>
      </div>
      <div class="tiwen-check" style="display:inline-block;">
        <p>监管原因：</p>
      </div>
      <div style="display:inline-block;">
        <el-checkbox v-model="isTemp">体温超过37.5</el-checkbox>
        <el-checkbox v-model="isCough">干咳</el-checkbox>
        <el-checkbox v-model="isWeak">乏力</el-checkbox>
        <el-checkbox v-model="it">其他</el-checkbox>
      </div>
      <div>
        <div style="padding-left:20px; padding-bottom: 20px; padding-top: 10px;">
 <el-button
          type="primary"
          style="width:155px;color:white;background-color:#5458b3;"
          @click="tiwenlist"
          >点击查询
        </el-button>
        </div>
      </div>
      <div class="tiwen-table">
        <el-table
          :data="tableData"
          border
          style="width: 90%"
          :header-cell-style="{background:'#5058b1',color:'#fff'}">
          <el-table-column type="index" label="#" width="50"></el-table-column>
          <el-table-column prop="name" label="姓名" width="100"></el-table-column>
          <el-table-column prop="info" label="个人信息" width="200"></el-table-column>
          <el-table-column prop="data" label="日期" width="100"></el-table-column>
          <el-table-column prop="bodyTemperature1" label="体温" width="100"></el-table-column>
          <el-table-column prop="symptom" label="是否不适" width="200"></el-table-column>
          <el-table-column prop="isNeighborBorderlineCase" label="同住人员出现不适"></el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>
<script>
import Api from "../assets/js/api";
export default {
  data() {
    return {
       pageNum: "1",
      pageSize: "10",
      name: "",
      snoTno: "",
      idCard:"",
      isTemp: "false",
      isCough: "false",
      isWeak: "false",
      it: "false",
      tableData: [],
      datalist: []
    };
  },
  mounted() {
  },
  methods: {
    tiwenlist() {
          if (this.idCard == "" || this.snoTno == "") {
        alert("请求参数格式不正确；学号/工号和身份证号不能都为空");
      } else {
      console.log(this.it)

        this.$http.get(Api.queryGuardianships, {
            params: {
              pageNum: this.pageNum,
              pageSize: this.pageSize,
              name: this.name,
              snoTno: this.snoTno,
              isTemp: this.isTemp,
              isCough: this.isCough,
              isWeak: this.isWeak,
              it: this.it
            }
          }).then((res) => {
          console.log(res);
          this.tableData = res.data.list;
        });
      }
    }
  }
};
</script>
<style scoped>
.tiwen {
  padding: 30px;
}
.tiwen-content {
  width: 100%;
  border-radius: 12px;
  background-color: #ffffff;
}
.tiwen-title {
  height: 55px;
  font-size: 24px;
  color: #a2a9d4;
  line-height: 55px;
  text-indent: 20px;
  border-bottom: 1px solid #ececff;
  margin-bottom: 15px;
}

.tiwen-table {
  margin-left: 20px;
  padding-bottom: 50px;
  box-sizing: border-box;
}
.tiwen-h2 {
  margin-left: 20px;
  padding-bottom: 30px;
  font-size: 22px;
  color: rgba(0, 0, 0, 0.7);
}
.tiwen-input {
  width: 250px;
  margin-left: 20px;
  display: inline-block;
  padding-bottom: 20px;
}
.tiwen-input > p {
  padding-bottom: 10px;
  font-size: 14px;
  color: rgb(90, 90, 90);
}
.riqi-input {
  padding-left: 20px;
  padding-bottom: 20px;
}
.riqi-input > p {
  padding-bottom: 10px;
  font-size: 14px;
  color: rgb(90, 90, 90);
}
.tiwen-check {
  padding-left: 20px;
  padding-bottom: 20px;
}
.tiwen-check > p {
  padding-bottom: 10px;
  font-size: 14px;
  color: rgb(90, 90, 90);
}
</style>